<style scoped lang="scss"></style>
<template>
  <div class="user-search">
    <SearchHeader :defaultTab="'user'" :placeholder="'用户描述'" @back="handleBack" @tab-change="handleSwitchTab"
      @search="handleSearch" />
    <UserRelationList :userList="userList" :showHeader="showHeader" title="搜索结果" @handleFollowClick="onFollowClick"
      :isSearch="true" />
  </div>
</template>
<script setup>
import SearchHeader from '@/components/common/SearchHeader.vue'
import UserRelationList from '../../components/common/UserRelationList.vue'
import { searchUserAPI } from '@/api/search/search'
import { triggerFollowAPI } from '@/api/message/message'
import { useUserStore } from '@/store/modules/user/user'
import { useRouter } from 'vue-router'
const router = useRouter()
const userStore = useUserStore()

const userList = ref([])
// 控制头部组件
const showHeader = ref(false)
const page = ref(1)
const handleBack = () => {
  router.push('/home')
}
const handleSwitchTab = (tab) => {
  if (tab === 'video') {
    router.push('/search/video')
  } else if (tab === 'user') {
    router.push('/search/user')
  }
}
const handleSearch = async (params) => {
  try {
    const res = await searchUserAPI(userStore.userInfo.userId, page.value, params.key)
    if (res.code === 200) {
      userList.value = res.data
      console.log(userList.value);
    }
  } catch (err) {
    console.log(err);
  }
}
// 处理关注/取消关注点击
const onFollowClick = async (item) => {
  try {
    const res = await triggerFollowAPI(userStore.userInfo.userId, item.item.userId)
    if (res.code === 200) {
      console.log(res);
      const currentStatus = item.item.myRelation
      console.log(currentStatus);
      
      // switch (currentStatus) {
      //   case 'none':
      //     userInfo.value.myRelation = 'follow'; // 未关注→已关注
      //     break;
      //   case 'follow':
      //     userInfo.value.myRelation = 'none'; // 已关注→取消关注
      //     break;
      //   case 'fan':
      //     userInfo.value.myRelation = 'both'; // 被关注→互相关注
      //     break;
      //   case 'both':
      //     userInfo.value.myRelation = 'fan'; // 互相关注→取消关注（仅自己取消）
      //     break;
      //   default:
      //     console.log('未知的关注状态:', currentStatus);
      // }
    }
  } catch (err) {
    console.log(err);
  }
}
</script>